import React, { Component, Fragment } from 'react';
import { Card, Descriptions, Image, Button, Space, Popover } from 'antd'
import { connect } from 'dva';
import constant from '../../constant/constant'

class TestDataPage extends Component {
    constructor(props) {
        super(props)
    }

    componentDidMount() {
        this.props.dispatch({
            type: "application/getTestMechanismInformation",
            data: { verificationApplicationId: this.props.verification.technologyId }
        })
    }

    goToNextProcess = () => {
        this.props.dispatch({
            type: "application/goToNextProcess",
            data: {
                verificationApplicationId: this.props.verification.technologyId
            }
        })
    }

    renderNextButton = test => {
        if (test.examinationStatus == 2) {
            return (
                <Button type="primary" style={{marginTop:30}} onClick={this.goToNextProcess}>下一步</Button>
            )
        }
    }

    render() {
        return (
            <Fragment>
                <Descriptions title="测试数据" bordered={true} column={2}>
                    <Descriptions.Item label="技术名称">{this.props.test.technologyName}</Descriptions.Item>
                    <Descriptions.Item label="验证机构">{this.props.test.verificationmechanismName}</Descriptions.Item>
                    <Descriptions.Item label="验证协议">{this.props.test.verificationAgreement ? <a href={constant.serverUrl + constant.fileUrl.mechanismUrl + this.props.test.verificationAgreement}>{this.props.test.verificationAgreement}</a> : "验证机构暂未上传"}</Descriptions.Item>
                    <Descriptions.Item label="申请者">{this.props.test.companyName}</Descriptions.Item>
                    <Descriptions.Item label="现存数据是否满足验证要求">{this.props.test.dataauditReport ? <Space><a>不满足</a><a href={constant.serverUrl + constant.fileUrl.mechanismUrl + this.props.test.dataauditReport}>{this.props.test.dataauditReport}</a></Space> : "满足"}</Descriptions.Item>
                    <Descriptions.Item label="测试机构">{this.props.test.testmechanismName}</Descriptions.Item>
                    <Descriptions.Item label="测试协议">{this.props.test.testAgreement ? <a href={constant.serverUrl + constant.fileUrl.mechanismUrl + this.props.test.testAgreement}>{this.props.test.testAgreement}</a> : "测试机构暂未上传"}</Descriptions.Item>
                    <Descriptions.Item label="测试报告">{this.props.test.testReport == null ? "测试机构暂未上传" :
                        (this.props.test.examinationStatus == 0 ? <Popover content={this.props.test.reason}><a style={{ color: "red" }}>您的测试报告未通过验证委员会审核！</a></Popover> :
                            (this.props.test.examinationStatus == 1 ? "您的测试报告正在审核中" : <a href={constant.serverUrl + constant.fileUrl.mechanismUrl + this.props.test.testReport}>{this.props.test.testReport}</a>)
                        )}
                    </Descriptions.Item>
                </Descriptions>

                <Descriptions style={{ marginTop: 30 }} title={this.props.test.testmechanismName} bordered={true}>
                    <Descriptions.Item label="联系电话">{this.props.test.phone}</Descriptions.Item>
                    <Descriptions.Item label="邮箱">{this.props.test.email}</Descriptions.Item>
                    <Descriptions.Item label="地址">{this.props.test.address}</Descriptions.Item>
                </Descriptions>
                {this.renderNextButton(this.props.test)}
            </Fragment>
        )
    }
}

const mapStateToProps = state => {
    let test = state.application.test
    let verification = state.application.verification
    return {
        test,
        verification,
    }
}

export default connect(mapStateToProps)(TestDataPage)